@charset "utf-8";
//@import "footer";
@import "reset";
//@import "header";
@import "searchheader";

html{
    background-color: #1e1e1e;
}

//个人中心
.per-cen{
    width: r(611px);
    margin: 0 auto;
    border-top: r(1px) solid #454545;
    .head-warp{
        margin: r(33px) auto 0 auto;
        width: r(129px);
        position: relative;
        span{
            display: block;
            width: r(33px);
            height: r(33px);
            background-color: #ff0000;
            line-height: r(33px);
            color: white;   
            font-size: r(17px);  
            border-radius: 50%;
            position: absolute;
            top: 0;
            right: 0;
            text-align: center;
        }
        img{
            width: r(129px);
            height: r(129px);
            display: block;
        }
    }
//  个人信息
    .per-info{
        width: r(192px);
        margin: r(15px) auto 0 auto;
        .name-center{
            width: 100%;
            .name{
                font-size: r(24px);
                width: r(75px); 
                height: r(24px);
                line-height: r(24px);
                color: white;
            }
            .center{
                a{  
                    color: white;
                    font-size: r(15px);
                    width: 100%;
                    height: 100%;
                    display: block; 
                    letter-spacing: 0; 
                    
                }
                width: r(102px);
                height: r(20px);
                border: r(1px) solid white;
                
                line-height: r(20px);
                text-align: center;
                margin-top: r(3px);
                margin-left: r(10px);
            }
        }
//      星星
        .starbar{
            width: 100%;
            font-size: 0;
            margin-top: r(8px);
            text-align: center;
            .starnav{
                display: inline-block;
                ul{
                    &:after{
                        content: "";
                        display: block;
                        clear: both;
                    }
                    li{
                        float: left;
                        margin-right: r(13px);
                        &:last-of-type{
                            margin-right: 0;
                        }
                        img{
                            width: r(20px);
                            height: r(20px);  
                        }
                    }
                }
            }
        }
        
        .focus-fans{
            margin-top: r(12px); 
            
            .focus{
                &::after{
                content: "";
                display: block;
                clear: both;
                }
                width: r(86px);
//              height: r(23px);
                font-size: r(22px);
                color: white;
                line-height: r(22px);
                span{
                    color: #b60005;
                    line-height: r(22px);
                    display: block;
                    float: right;
//                  margin-top: r(4px);
                    margin-right: r(8px);
                    
                }
                
                
            }
            
            .line{
            width: r(2px);
            height: r(22px);
            background: #a2a2a2;
//          margin-top: r(2px);  
        }
        
        .fans{
                &::after{
                content: "";
                display: block;
                clear: both;
                }
                width: r(90px); 
                margin-left: r(10px);
//              height: r(23px);  
                font-size: r(22px);
                color: white;
                line-height: r(22px);   
                span{
                    color: #b60005;
                    line-height: r(22px);
                    display: block;
                    float: right;
//                  margin-top: r(4px);
//                  margin-right: r(8px);
                    
                }
                
                  
            }
            
        }
        
        
        
        
    }
     
    .btn{
            width: r(461px);
            margin: r(22px) auto 0 auto;
            input{
                width: r(219px);
                height: r(52px);
                border-radius: r(36px);
//              background: #b60005;
                font-size: r(23px);
                line-height: r(52px);
                text-align: center;
                border: 0px; 
                outline: none;   
//              去除默认样式
                -webkit-appearance: none;  
            }
            input:first-of-type{
                background-color: #b60005;
            }
            input:nth-of-type(2){
                background-color: #cdcdcd;
            }
        }
      
    
}

.blodline{
    width: 100%;
    height: r(23px);
    margin-top: r(21px);
    background-color: #303030;
//  background-color: white; 
    
}


.gimc{
    width: r(576px);
    margin: r(53px) auto 0 auto;
    font-size: 0;  
    padding-bottom: r(23px);
    border-bottom: r(1px) solid #2d2d2d;
//  height: r(18px);
//  background-color: white;   
    p{
        height: r(18px); 
        color: #7f7f7f;
        font-size: r(18px); 
    }
    p:nth-of-type(2){
        margin-right: r(8px);
    }
}

.titlecen{
    width: 100%;    
    border-top: r(1px) solid #313131;
//  margin-top: r(23px);  
            &:first-of-type .title{
                margin-top: 0; 
            }
    .title{
        width: r(430px);
        font-size: r(21px);
        line-height: r(85px);
        color: white;
        text-align: center; 
        margin: 0 auto; 
        
    }
    
    .content{
        width: r(575px);
        margin: 0 auto;
//      display: none; 
        .cell{
            border-top: r(1px) solid $blackborder; 
            p{
                color: #656565;
                font-size: r(23px);
                line-height: r(88px);
                
            }
            p:nth-of-type(2){
                margin-right: r(8px);
                  
            } 
        }
        
    }
    &:hover .content{  
            display: block;
        }
}


//退出
.out{
    width: r(182px);
    height: r(53px);
    border-radius: r(26px);
    line-height: r(53px); 
    font-size: r(22px);
    text-align: center;  
    background-color: #b60005;
    margin: r(24px) auto 0 auto;  
    a{
        color: white; 
        width: 100%;
        height: 100%;
        display: block;  
        text-align: center;  
    }      
}
